import 'package:aero_frisbee/app/model/af_coin_product_model/af_coin_product_model.dart';
import 'package:aero_frisbee/gen/assets.gen.dart';
import 'package:flutter/material.dart';

class AfAppPurchaseCell extends StatelessWidget {
  const AfAppPurchaseCell({Key? key, required this.item}) : super(key: key);

  final AfCoinProductModel item;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(8),
        child: Stack(
          children: [
            Container(
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(8),
              ),
              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 26),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Padding(
                    padding: const EdgeInsets.only(left: 4),
                    child: Row(
                      children: [
                        Assets.icons.iconGiftsCount.image(width: 34),
                        const SizedBox(
                          width: 15,
                        ),
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              '${item.exchangeCoin}',
                              style: const TextStyle(
                                color: Color(0xff523E0B),
                                fontWeight: FontWeight.normal,
                                fontSize: 14,
                              ),
                              textAlign: TextAlign.left,
                              overflow: TextOverflow.ellipsis,
                              maxLines: 1,
                            ),
                            const SizedBox(
                              height: 6,
                            ),
                            Visibility(
                              visible: item.discount != 0,
                              child: Text(
                                '${((item.discount ?? 0) * 100).toInt()}% off',
                                style: const TextStyle(
                                  color: Color(0xffFFC657),
                                  fontWeight: FontWeight.normal,
                                  fontSize: 14,
                                ),
                                textAlign: TextAlign.left,
                                overflow: TextOverflow.ellipsis,
                                maxLines: 1,
                              ),
                            )
                          ],
                        ),
                      ],
                    ),
                  ),
                  Row(
                    children: [
                      Visibility(
                        visible: item.originalPrice != item.price,
                        child: Text(
                          '\$${item.price}',
                          style: const TextStyle(
                            color: Color(0xff202020),
                            fontWeight: FontWeight.normal,
                            fontSize: 18,
                          ),
                          textAlign: TextAlign.center,
                          overflow: TextOverflow.ellipsis,
                          maxLines: 1,
                        ),
                      ),
                      const SizedBox(
                        width: 8,
                      ),
                      Text(
                        '\$${item.originalPrice}',
                        style: TextStyle(
                          color: const Color(0xff000000).withOpacity(0.3),
                          fontWeight: FontWeight.normal,
                          fontSize: 10,
                          decoration: item.originalPrice != item.price
                              ? TextDecoration.lineThrough
                              : null,
                          decorationColor:
                              const Color(0xff000000).withOpacity(0.3),
                        ),
                        textAlign: TextAlign.center,
                        overflow: TextOverflow.ellipsis,
                        maxLines: 1,
                      )
                    ],
                  ),
                ],
              ),
            ),
            Positioned(
              top: 0,
              right: 0,
              child: Visibility(
                visible: item.tags != null && item.tags!.isNotEmpty,
                child: Container(
                  decoration: const BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(0),
                      topRight: Radius.circular(8),
                      bottomRight: Radius.circular(0),
                      bottomLeft: Radius.circular(8),
                    ),
                    gradient: LinearGradient(
                      colors: [
                        Color(0xff0CEBEB),
                        Color(0xff29FFC6),
                      ],
                      begin: Alignment.centerLeft,
                      end: Alignment.centerRight,
                    ),
                  ),
                  padding:
                      const EdgeInsets.symmetric(horizontal: 12, vertical: 3),
                  child: Text(
                    '${item.tags}',
                    style: const TextStyle(
                      color: Color(0xffffffff),
                      fontWeight: FontWeight.normal,
                      fontSize: 12,
                    ),
                    textAlign: TextAlign.center,
                    overflow: TextOverflow.ellipsis,
                    maxLines: 1,
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}
